<template>
  <div style="" class="err_container">
      <div style="margin-top:20px;margin-left:20px"  v-show="flag">

            <el-row>
                <el-col :offset="1">
                    <div id="qrcode" ref="qrcode"></div>
                </el-col>
                </el-row>
                <el-row>
                    <el-col :offset="1">
                    <div style="margin-top:10px"> 小程序扫码拍照提交型号别名</div>
                </el-col>
            </el-row>

      </div>
        <div v-show="!flag"  style="margin-top:20px;margin-left:20px;color:red;font-size:45px">
        {{msg}}
      </div>

  </div>
</template>

<script>
import QRCode from 'qrcodejs2'
export default {
  name: 'error',
  methods: {
    // 生成二维码
    qrcode () {
      const msg = this.msg
      const qrcode = new QRCode('qrcode', {
        width: 200,
        height: 200,
        text: msg,
        correctLevel: QRCode.CorrectLevel.Q
      })
      console.log(qrcode, '---')
    }
  },

  created () {
    this.msg = this.$route.query.msg
  },
  mounted () {
    try {
      JSON.parse(this.msg)
      this.qrcode()
      this.flag = true
    } catch (err) {
      console.log(err)
      this.flag = false
    }
  },
  data () {
    return {
      msg: '',
      url: null,
      flag: false
    }
  }
}
</script>

<style lang="less">

.err_container{
    #qrcode{
        width: 200px;
        height: 200px;
    }
     *{
    padding: 0;
    margin: 0;
     }
     position: fixed;
     left: 0;
     top: 0;
     bottom: 0;
     right: 0;
    background-color: #fdf6ec;
    p{
        margin: 0;
        line-height: 55px;
        font-size: 55px  !important;
        color:red;
    }
}

</style>
